<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> 
<html>
<head>
<title>QtJambi dialogs</title>
<link rel="stylesheet" href="/cfg/format.css" type="text/css">
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<meta name="keywords" content="GUI, dialogs, QtJambi, Java">
<meta name="description" content="QtJambi dialogs">
<meta name="language" content="en">
<meta name="author" content="Jan Bodnar">
<meta name="distribution" content="global">

<script type="text/javascript" src="/lib/jquery.js"></script>
<script type="text/javascript" src="/lib/common.js"></script>

</head>

<body>

<div class="container">

<div id="wide_ad" class="ltow">
<script type="text/javascript"><!--
google_ad_client = "pub-9706709751191532";
/* 160x600, August 2011 */
google_ad_slot = "2484182563";
google_ad_width = 160;
google_ad_height = 600;
//-->
</script>
<script type="text/javascript"
src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
</script>
</div>

<div class="content">


<a href="/" title="Home">Home</a>&nbsp;
<a href="..">Contents</a>


<h1>QtJambi dialogs</h1>

<p>
In this part of the QtJambi programming tutorial, we will work with dialogs. 
</p>

<div class="center"> 
<script type="text/javascript"><!--
google_ad_client = "pub-9706709751191532";
/* horizontal */
google_ad_slot = "1734478269";
google_ad_width = 468;
google_ad_height = 60;
//-->
</script> 
<script type="text/javascript"
src="http://pagead2.googlesyndication.com/pagead/show_ads.js"> 
</script> 
</div> 

<p>
Dialog windows or dialogs are an indispensable part of most modern GUI applications. 
A dialog is defined as a conversation between two or more persons. In a computer 
application a dialog is a window which is used to "talk" to the application. 
A dialog is used to input data, modify data, change the application settings etc. 
Dialogs are important means of communication between a user and a computer program. 
</p>


<h2>Message boxes</h2>

<p>
Message boxes are convenient dialogs that provide messages to the user 
the application. The message consists of text and image data. 
</p>

<pre class="code">
package com.zetcode;

import com.trolltech.qt.QSignalEmitter;
import com.trolltech.qt.gui.QApplication;
import com.trolltech.qt.gui.QGridLayout;
import com.trolltech.qt.gui.QMessageBox;
import com.trolltech.qt.gui.QPushButton;
import com.trolltech.qt.gui.QWidget;

/**
 * ZetCode QtJambi tutorial
 *
 * This program demonstrates
 * QMessageBox dialogs
 *
 * @author jan bodnar
 * website zetcode.com
 * last modified March 2009
 */

public class JambiApp extends QWidget {
    
    public JambiApp() {

        setWindowTitle("Message Dialogs");

        initUI();

        resize(220, 90);
        move(400, 300);
        show();
    }
    
    private void initUI() {

        QGridLayout grid = new QGridLayout(this);
        grid.setSpacing(2);

        QPushButton error = new QPushButton("Error", this);
        QPushButton warning = new QPushButton("Warning", this);
        QPushButton question = new QPushButton("Question", this);
        QPushButton information = new QPushButton("Information", this);
        QPushButton about = new QPushButton("About", this);

        grid.addWidget(error, 0, 0);
        grid.addWidget(warning, 0, 1);
        grid.addWidget(question, 1, 0);
        grid.addWidget(information, 1, 1);
        grid.addWidget(about, 2, 0);

        error.clicked.connect(this, "showDialog()");
        warning.clicked.connect(this, "showDialog()");
        question.clicked.connect(this, "showDialog()");
        information.clicked.connect(this, "showDialog()");
        about.clicked.connect(this, "showDialog()");
    }

    private void showDialog() {

        QPushButton button = (QPushButton) QSignalEmitter.signalSender();

        if ("Error".equals(button.text())) {
            QMessageBox.critical(this, "Error", "Error loading file!");
        } else if ("Warning".equals(button.text())) {
            QMessageBox.warning(this, "Warning", "Operation not permitted!");
        } else if ("Question".equals(button.text())) {
            QMessageBox.question(this, "Question", "Are you sure to quit?");
        } else if ("Information".equals(button.text())) {
            QMessageBox.information(this, "Information", "Download completed.");
        } else if ("About".equals(button.text())) {
            QMessageBox.about(this, "About", "ZetCode QtJambi tutorial.");
        }
    }

    public static void main(String[] args) {
        QApplication.initialize(args);
        new JambiApp();
        QApplication.exec();
    }
}
</pre>

<p>
We use the <b class="keyword">GridLayout</b> manager to set up a grid of
five buttons. Each of the buttons shows a different message box. 
</p>

<pre class="explanation">
QPushButton button = (QPushButton) QSignalEmitter.signalSender();
</pre>

<p>
Here we determine, which button called the <b class="keyword">showDialog()</b> 
method. 
</p>

<pre class="explanation">
if ("Error".equals(button.text())) {
    QMessageBox.critical(this, "Error", "Error loading file!");
}
</pre>

<p>
In case we pressed the error button, we show the error dialog. 
We use static methods of the <b class="keyword">QMessageBox</b> class to show
the message boxes.  
</p>


<br>
<img src="/img/gui/qtjambi/infodlg.png" alt="Information message dialog">&nbsp;&nbsp;
<img src="/img/gui/qtjambi/warningdlg.png" alt="Warning message dialog">&nbsp;&nbsp;
<img src="/img/gui/qtjambi/questiondlg.png" alt="Question message dialog">&nbsp;&nbsp;
<img src="/img/gui/qtjambi/errordlg.png" alt="Error message dialog">&nbsp;&nbsp;
<img src="/img/gui/qtjambi/aboutdlg.png" alt="About message dialog">
<br>
<br>



<h2>QInputDialog</h2>

<p>
The <b class="keyword">QInputDialog</b> class provides a simple convenience 
dialog to get a single value from the user. The input value can be a string, 
a number or an item from a list. A label must be set to tell the 
user what they should enter.
</p>

<pre class="code">
package com.zetcode;

import com.trolltech.qt.core.Qt;
import com.trolltech.qt.gui.QApplication;
import com.trolltech.qt.gui.QInputDialog;
import com.trolltech.qt.gui.QLineEdit;
import com.trolltech.qt.gui.QPushButton;
import com.trolltech.qt.gui.QWidget;

/**
 * ZetCode QtJambi tutorial
 * 
 * This program shows an input
 * dialog
 *
 * @author jan bodnar
 * website zetcode.com
 * last modified March 2009
 */

public class JambiApp extends QWidget {

    QLineEdit edit;

    public JambiApp() {

        setWindowTitle("Input Dialog");

        initUI();

        move(400, 300);
        show();
    }


    private void initUI() {

        setGeometry(300, 300, 350, 80);

        QPushButton show = new QPushButton("Dialog", this);

        show.clicked.connect(this, "showDialog()");
        show.setFocusPolicy(Qt.FocusPolicy.NoFocus);

        show.move(20, 20);

        edit = new QLineEdit(this);
        edit.move(130, 22);
    }

    private void showDialog() {
        
        String text = QInputDialog.getText(
                this, "Input Dialog", "Enter your name");

        if (text!=null &amp;&amp; !text.trim().isEmpty()) {
            edit.setText(text);
        }
    }

    public static void main(String[] args) {
        QApplication.initialize(args);
        new JambiApp();
        QApplication.exec();
    }
}
</pre>

<p>
In the code example, we have a button and a line edit. The button shows
an input dialog. We get some text and the text is shown in the line edit widget. 
</p>

<pre class="explanation">
String text = QInputDialog.getText(
        this, "Input Dialog", "Enter your name");
</pre>

<p>
The <b class="keyword">getText()</b> static method creates the input dialog.
The text from the dialog is stored in the text variable. 
</p>

<pre class="explanation">
if (text!=null &amp;&amp; !text.trim().isEmpty()) {
    edit.setText(text);
}
</pre>

<p>
Before we update the line edit, we ensure, that the text variable is
not null and that it is not empty and does not consists only from spaces. 
</p>

<br>
<img src="/img/gui/qtjambi/inputdlg.png" alt="Input dialog">
<div class="figure">Figure: Input dialog</div>


<h2>QColorDialog</h2>

<p>
The <b class="keyword">QColorDialog</b>  class provides a dialog widget 
for specifying colors. The color dialog's function is to allow users 
to choose colors.
</p>

<pre class="code">
package com.zetcode;

import com.trolltech.qt.core.Qt;
import com.trolltech.qt.gui.QApplication;
import com.trolltech.qt.gui.QColor;
import com.trolltech.qt.gui.QColorDialog;
import com.trolltech.qt.gui.QLabel;
import com.trolltech.qt.gui.QMouseEvent;
import com.trolltech.qt.gui.QVBoxLayout;
import com.trolltech.qt.gui.QWidget;
import java.util.Formatter;

/**
 * ZetCode QtJambi tutorial
 *
 * In this program, we use the
 * QColorDialog to change the color
 * of a label text
 *
 * @author jan bodnar
 * website zetcode.com
 * last modified March 2009
 */


public class JambiApp extends QWidget {
    
    QLabel label;

    public JambiApp() {

        setWindowTitle("Color Dialog");

        initUI();

        resize(250, 200);
        move(400, 300);
        show();
    }

    private void initUI() {

        label = new QLabel("ZetCode QtJambi tutorial", this);

        QVBoxLayout vbox = new QVBoxLayout(this);
        label.setAlignment(Qt.AlignmentFlag.AlignCenter);
        vbox.addWidget(label);

    }

    @Override
    public void mousePressEvent(QMouseEvent event) {

        QColor color = QColorDialog.getColor();

        if (!color.isValid()) return;

        Formatter fmt = new Formatter();
        fmt.format("QWidget { color: %s }", color.name());

        label.setStyleSheet(fmt.toString());
    }
    
    
    public static void main(String[] args) {
        QApplication.initialize(args);
        new JambiApp();
        QApplication.exec();
    }
}
</pre>

<p>
We show a some text in the center of the window. By clicking on the area of the
window, we show a color dialog. We change the text 
foreground color to the selected color from the dialog. 
</p>

<pre class="explanation">
@Override
public void mousePressEvent(QMouseEvent event) {
    ...
}
</pre>

<p>
In order to receive mouse press events for our window, we must reimplement the 
<b class="keyword">mousePressEvent()</b> method.
</p>

<pre class="explanation">
QColor color = QColorDialog.getColor();
</pre>

<p>
The <b class="keyword">QColorDialog</b> is being created. The selected
color is stored in the <b class="keyword">color</b> variable.
</p>

<pre class="explanation">
Formatter fmt = new Formatter();
fmt.format("QWidget { color: %s }", color.name());

label.setStyleSheet(fmt.toString());
</pre>

<p>
Here we update the foreground color of the label's text.
</p>

<br>
<img src="/img/gui/qtjambi/colordlg.png" alt="QColorDialog">
<div class="figure">Figure: QColorDialog</div>


<h2>QFontDialog</h2>

<p>
The <b class="keyword">QFontDialog</b> class provides a dialog widget for selecting a font.
</p>

<pre class="code">
package com.zetcode;

import com.trolltech.qt.core.Qt;
import com.trolltech.qt.gui.QApplication;
import com.trolltech.qt.gui.QFontDialog;
import com.trolltech.qt.gui.QLabel;
import com.trolltech.qt.gui.QMouseEvent;
import com.trolltech.qt.gui.QVBoxLayout;
import com.trolltech.qt.gui.QWidget;

/**
 * ZetCode QtJambi tutorial
 *
 * In this program, we use the
 * QFontDialog to change the font
 * of a label text
 * 
 * @author jan bodnar
 * website zetcode.com
 * last modified March 2009
 */

public class JambiApp extends QWidget {

    QLabel label;

    public JambiApp() {
        
        setWindowTitle("QFontColor dialog");

        initUI();

        resize(250, 200);
        move(300, 300);
        show();
    }


    private void initUI() {

        label = new QLabel("ZetCode QtJambi tutorial", this);

        QVBoxLayout vbox = new QVBoxLayout(this);
        label.setAlignment(Qt.AlignmentFlag.AlignCenter);
        vbox.addWidget(label);
    }

    @Override
    public void mousePressEvent(QMouseEvent event) {

        QFontDialog.Result result = QFontDialog.getFont();

        if (!result.ok) return;

        label.setFont(result.font);
    }
    
    
    public static void main(String[] args) {
        QApplication.initialize(args);
        new JambiApp();
        QApplication.exec();
    }
}
</pre>

<p>
This example is similar to the previous one. This time, we change
the font of the text. 
</p>

<pre class="explanation">
QFontDialog.Result result = QFontDialog.getFont();
</pre>

<p>
The <b class="keyword">QFontDialog</b> is being created. 
The dialog returns the <b class="keyword">QFontDialog.Result</b> class.
This class has two fields. The font and the ok field. 
</p>

<pre class="explanation">
if (!result.ok) return;
</pre>

<p>
The boolean <b class="keyword">ok</b> variable is true, if we clicked on
the OK button of the dialog. We return from the method, if the cancel button 
was pressed. 
</p>

<pre class="explanation">
label.setFont(result.font);
</pre>

<p>
The <b class="keyword">font</b> field stores the selected font. We update the label's font
to the newly selected font. 
</p>

<br>
<img src="/img/gui/qtjambi/fontdlg.png" alt="QFontDialog">
<div class="figure">Figure: QFontDialog</div>

<hr class="btm">

<p>
In this part of the QtJambi tutorial, we worked with dialog windows. 
</p>

<br>
<div class="center"> 
<script type="text/javascript"><!--
google_ad_client = "pub-9706709751191532";
/* horizontal */
google_ad_slot = "1734478269";
google_ad_width = 468;
google_ad_height = 60;
//-->
</script> 
<script type="text/javascript"
src="http://pagead2.googlesyndication.com/pagead/show_ads.js"> 
</script> 
</div> 
<br>


<div class="botNav, center">
<span class="botNavItem"><a href="/">Home</a></span> ‡ <span class="botNavItem"><a href="..">Contents</a></span> ‡
<span class="botNavItem"><a href="#">Top of Page</a></span>
</div>


<div class="footer">
<div class="signature">
<a href="/">ZetCode</a> last modified April 27, 2009  <span class="copyright">&copy; 2007 - 2012 Jan Bodnar</span>
</div>
</div>

</div> <!-- content -->

</div> <!-- container -->

</body> 
</html>
